<template>
	<view class="container">
		<scroll-view scroll-y class="scroll-view" @scrolltolower="onRefresh" @scroll="scroll" :scroll-top="scrollTop">
			<swiper v-if="bannerList.length > 0" class="swiper" :indicator-dots="true" indicator-active-color="#ffffff" indicator-color="rgba(255,255,255,0.32)">
				<swiper-item v-for="item in bannerList" style="border-radius: 20rpx;" @click="toImgLink(item)">
					<image class="img" mode="widthFix" :src="item.img" />
				</swiper-item>
			</swiper>
			<view class="data">
				<navigator v-for="item in exhibitionList" @click="toExhibitionDetail(item)"  hover-class="none" class="item">
					<view class="title">{{item.exhibitionName}}</view>
					<image class="img" :src="item.exhibitionShowImg" mode="widthFix" />
					<view class="info">
						<view class="texts">
							<view v-if="item.ifTimeUndetermined != 1" class="text">时间：{{item.startDate}}-{{item.endDate}}</view>
							<view v-else class="text">展会开展时间待定</view>
							<view class="text">地点：{{item.exhibitionAddress}}</view>
							<view class="text">展馆：{{item.grandExhibitionHall}}</view>
						</view>
						<view class="more">点击查看>></view>
					</view>
				</navigator>
			</view>
			<hint ref="hint"></hint>
		</scroll-view>
	</view>
</template>

<script>
import exhibitionApi from '@/api/exhibitionlist.js';
import commonMethod from '@/utils/commonMethod.js';
export default {
	data() {
		return {
			search:{
				limit:10,
				page:1,
			},
			bannerList:[],
			exhibitionList:[],
			scrollTop:0,
			currentPage:1,
			totalPage:0,
			
			currentUser:{},
			startTime:'', //进入页面时间
			endTime:'',//离开页面时间
			currentUrl:'',//当前页面全路径
		};
	},
	async created() {
		const currentPromise = await commonMethod.currentUserAxios()
		this.currentUser = currentPromise.data.session_user_h5
	},
	mounted() {
		const pages = getCurrentPages()
		const currentPage =pages[pages.length - 1]
		this.currentUrl = currentPage.$page.fullPath
		
		this.queryExhibitionList();

	 	exhibitionApi.getBannerList().then(data =>{
	 		this.bannerList = data.data.list;
			console.log("bannerList");
			console.log(this.bannerList);
	 	});
		
	},
	onShow(){
		
		setTimeout(()=> {
			
			if (getApp().globalData.onShow) {
				getApp().globalData.onShow = 0;
				console.log("demo前后台切换之切到前台")
			}
			else {
				console.log("demo页面被切换显示")
				this.startTime = +new Date();
			}
			
		}, 100);
	},
	onHide(){
		setTimeout(() => {
			var that = this
			if (getApp().globalData.onHide) {
				getApp().globalData.onHide = 0;
				console.log("还在当前页面活动")
			}
			else {
				that.endTime = +new Date();
				console.log("demo页面停留时间：" + (that.endTime - that.startTime))
				var stayTime = Math.round((that.endTime - that.startTime)/1000);
			   //这里获取到页面停留时间stayTime，然后了可以上报了
			   this.saveFootPrint(stayTime);
			}
		}, 100)
	},
	methods: {
		saveFootPrint(stayTime){
			commonMethod.saveFootPrint(this.currentUser.id,this.startTime,stayTime,this.currentUrl,"展会")
		},
		
		queryExhibitionList(){
			exhibitionApi.getExhibitionList(this.search).then(data =>{
				let resList = data.data.page.list;
				this.currentPage = data.data.page.currPage;
				this.totalPage = data.data.page.totalPage;
				
				for (let i = 0; i < resList.length; i++) {
					resList[i].startDate = resList[i].startDate.replace(/-/g,".");
					resList[i].endDate = resList[i].endDate.replace(/-/g,".");
					let endTime = new Date(resList[i].endDate)
					let currentTime = new Date();
					if(currentTime > endTime){
						resList[i].ifEnd = false;
					}else{
						resList[i].ifEnd = true;
					}
				}
				this.exhibitionList = this.exhibitionList.concat(resList);
				
			});
		},
		toImgLink(item){
			if(item.linkAddress != null && item.linkAddress != ''){
				uni.navigateTo({
					url:item.linkAddress,
				})
			}else{
				return ;
			}
		},
		async toExhibitionDetail(item){
      //判断是否登录
      /*this.register = await commonMethod.getUserLoginFlag();
      if (this.register) {
        uni.navigateTo({
          url: '/pages/account/login/login',
        })
      }*/
			uni.navigateTo({
				url: '/pages/exhibition/detail/detail?id=' + item.id
			})
		},
		scroll(e) {
			this.scrollTop = e.detail.scrollTo;
			this.$store.dispatch('renewScrollTop', e.detail.scrollTop);
		},
		onRefresh() {
			if(this.currentPage < this.totalPage){
				this.search.page++;
				this.$refs.hint.setStatus('loading');
				console.log("还有下一页" + this.search.page);
				this.queryExhibitionList();
			}else{
				this.$refs.hint.setStatus('loadingComplete');
				console.log("没有下一页")
			}
		},
		
	}
};
</script>

<style lang="scss">
.container {
  padding: 0px $interval;
  height: 100vh;
  overflow-y: auto;
}
.scroll-view{
	height:calc(100% - 20rpx);
}
.swiper {
  height: 240rpx;
  box-shadow: 0px 4rpx 8rpx 0px rgba(0, 0, 0, 0.04);
  border-radius: 20rpx;
  overflow: hidden;
  margin: 26rpx 0px 20rpx;
  .img {
    width: 100%;

    height: 240rpx;
  }
}
.swiper {
	height: 240rpx;
	box-shadow: 0px 4rpx 8rpx 0px rgba(0, 0, 0, 0.04);
	border-radius: 20rpx;
	overflow: hidden;
	margin: 26rpx 0px 20rpx;
	.img {
		width: 100%;

		height: 240rpx;
	}
}
.data{
	.item{
		margin-bottom: $interval;
		background-color: #fff;
		padding-bottom:  $interval-min;
		border-radius: 10rpx;
		overflow: hidden;
		.title{
			background-color: $color-primary;
			font-size: $font-size-max;
			font-weight: 600;
			text-align: center;
			color: #fff;
			
			padding: $interval-min 50rpx;	white-space:nowrap;
			overflow:hidden;
			text-overflow:ellipsis;
		}
		.img{
			width:100%;
		}
		.info{
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
			padding: 0px $interval;
			
			.texts{
			
				.text{
					margin: 10rpx 0px;
				}
				
			}
			.more{
				color: $color-primary;
				font-weight: bold;
			}
		}
	}
	.item:last-child{
		margin-bottom: 0px;
	}
}
.hint {
	text-align: center;
	padding: 15px 0px;
	color: $text-color-grey;
	font-size: $font-size-min;
}
</style>
